<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Gooey Templates : Buttons</title>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<meta http-equiv="Expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
		<meta http-equiv="Pragma" content="no-cache" />
		<link rel="stylesheet" href="css/reset-fonts.css" type="text/css" media="screen, projection" />
		<link rel="stylesheet" href="css/gt-styles.css" type="text/css" media="screen, projection" />
	</head>
	<body>
		<!-- head -->
		<div class="gt-hd clearfix">
			<!-- leaf watermark -->
			<div class="gt-leaf-watermark clearfix">
			
			<!-- head top -->
			<div class="gt-hd-top clearfix">
				
				<div class="gt-fixed-wrap clearfix">
				
				<!-- logo -->
				<div class="gt-logo">
					eco style app <img class="gt-leaf" src="images/gt/leaf-logo-icon.png" alt="leaf-logo-icon" width="49" height="44"/>
				</div>
				<!-- / logo -->
				
				<!-- utility box -->
				<div class="gt-util-box">
					<div class="gt-util-box-inner">
						<p>welcome <strong>sarah</strong> <span class="gt-util-separator">|</span> <a href="">logout</a></p>
					</div>
				</div>
				<!-- / utility box -->
				
				</div>
			
			</div><!-- /head top -->
			
			<!-- navbar -->
			<div class="gt-navbar clearfix">
				
				<div class="gt-fixed-wrap clearfix">
				
				<!-- navigation -->
				<div class="gt-nav">
					<ul>
						<li><a href="index.html">Home</a></li>
						<li><a href="base.html">Base HTML</a></li>
						<li><a href="tables.html">Tables</a></li>
						<li><a href="forms.html">Forms</a></li>
						<li><a href="text-styles.html">Text Styles</a></li>
						<li><a class="gt-active" href="buttons.html">Buttons</a></li>
						<li><a href="login.html">Login</a></li>
					</ul>
				</div><!-- / navigation -->
				
				<!-- search -->
				<div class="gt-search"><div class="gt-search-inner">
					<input type="text" class="gt-search-text" value="Search" onfocus="javascript:if(this.value=='Search')this.value='';" onblur="javascript:if(this.value=='')this.value='Search';" />
				</div></div>
				
				</div>
				
			</div><!-- /navbar -->			
		</div><!-- /leaf watermark -->
		</div>
		<!-- / head -->
		
		<!-- body -->
		<div class="gt-bd clearfix">
			
			<!-- main content -->
			<div class="gt-content clearfix">
				
				<h1>Buttons</h1>
				<p>This template contains the following buttons. Each button uses html text, so you can change the wording to say
				anything you'd like.</p>
				
				<div class="gt-left-col">
					<!-- gray buttons -->
					<h3>Gray Buttons</h3>
					
					<p>Mini Button, use class "gt-btn-gray-mini"</p>
					<p><a href="" class="gt-btn-gray-mini">Go</a></p>
					
					<p>Small Button, use class "gt-btn-gray-small"</p>
					<p><a href="" class="gt-btn-gray-small">Send</a></p>
					
					<p>Medium Button, use class "gt-btn-gray-medium"</p>
					<p><a href="" class="gt-btn-gray-medium">Submit</a></p>
					
					<p>Large Button, use class "gt-btn-gray-large"</p>
					<p><a href="" class="gt-btn-gray-large">Add New Article</a></p>
					
					<p>You can also add any of these classes to an input element.</p>
					<p><input type="submit" class="gt-btn-gray-medium" value="Search" /></p>
					
					<p class="clearfix"><a href="" class="gt-btn-gray-small gt-btn-left">Send</a> This button is floated to the left of text</p>
				</div>
				
				<div class="gt-right-col">
					<!-- blue buttons -->
					<h3>Blue Buttons</h3>
					<p>Mini Button, use class "gt-btn-blue-mini"</p>
					<p><a href="" class="gt-btn-blue-mini">Go</a></p>
					
					<p>Small Button, use class "gt-btn-blue-small"</p>
					<p><a href="" class="gt-btn-blue-small">Send</a></p>
					
					<p>Medium Button, use class "gt-btn-blue-medium"</p>
					<p><a href="" class="gt-btn-blue-medium">Submit</a></p>
					
					<p>Large Button, use class "gt-btn-blue-large"</p>
					<p><a href="" class="gt-btn-blue-large">Add New Article</a></p>
					
					<p>You can also add any of these classes to an input element.</p>
					<p><input type="submit" class="gt-btn-blue-medium" value="Search" /></p>
					
					<p>You can also float buttons to the right</p>
					<p class="clearfix">
					<a href="" class="gt-btn-blue-large gt-btn-right">Save &amp; Publish</a>
					<a href="" class="gt-btn-blue-small gt-btn-right">Save</a></p>
				</div>
				
			</div>
			<!-- / main content -->
			
			
		</div>
		<!-- / body -->
		
		<!-- footer -->
		<div class="gt-footer"><div class="gt-footer-inner">
			<p>Copyright &copy; 2010 Gooey Templates - <a href="http://www.gooeytemplates.com" target="_blank">GooeyTemplates.com</a></p>
		</div></div>
		<!-- /footer -->
	</body>
</html>